import CustomTable from "@/components/CustomTable";
import Dialog from "@/components/PublicDialog";
import CustomForm from "@/components/CostumForm";
import { ElMessage } from "element-plus";
import { ref, onMounted } from "vue";

export default (props) => {
  const { getFn = () => {}, updateFn = () => {}, addFn = () => {} } = props;
  const dataSource = ref([]);
  const params = ref({});
  const addParam = ref({});
  const showAddPane = ref(false);
  const pagination = ref({
    total: 0,
    current: 1,
    size: 10,
  });

  const getDataSource = async () => {
    const { size, current } = pagination.value;
    const { data } = await getFn({
      ...params.value,
      pageNum: current,
      pageSize: size < 10 ? 10 : size,
    });

    const { content, pageSize, pageNum, totalPages, totalSize } = data;
    dataSource.value = content;
    pagination.value = { total: totalSize, current: pageNum, size: pageSize };
  };

  const onUpdate = async (row) => {
    const { code, msg } = await updateFn([{ ...row }]);
    if (code != "200") return;
    ElMessage.success(msg);
    getDataSource();
  };

  const onPageChange = ({ page, limit }) => {
    pagination.value.current = page;
    pagination.value.size = limit;
    getDataSource();
  };

  const onEdit = (row) => {
    row.isEdit = true;
  };
  const onSave = (row) => {
    onUpdate(row);
  };
  const onCancel = (row) => {
    row.isEdit = false;
  };
  const openAdd = (flag = false) => {
    showAddPane.value = flag;
  };
  const onAdd = async () => {
    const { data, msg, code } = await addFn({ ...addParam.value });
    if (code != "200") return;
    openAdd();
    getDataSource();
    addParam.value = {};
    ElMessage.success(msg);
  };

  onMounted(() => {
    getDataSource();
  });

  return {
    dataSource,
    params,
    pagination,
    addParam,
    showAddPane,
    onSave,
    onEdit,
    onCancel,
    onPageChange,
    getDataSource,
    onAdd,
    openAdd,
    CustomTable,
    Dialog,
    CustomForm,
  };
};
const defaultPaginaion = () => ({
  current: 1,
  total: 0,
  size: 50,
});

export function usePageList(apiFn, compParams = {}) {
  const searchData = ref({ ...compParams });
  const dataSource = ref([]);
  const loading = ref(false);
  const pagination = ref({
    ...defaultPaginaion(),
  });
  const selectedKeys = ref([]);

  const search = async (formData) => {
    if (formData) {
      searchData.value = {
        ...searchData.value,
        ...formData,
      };
    }
    getDataSource();
  };

  const getDataSource = async () => {
    loading.value = true;
    const { current: pageNum, size: pageSize, ...rest } = pagination.value;
    const { data } = await apiFn({
      pageSize,
      pageNum,
      param: { ...searchData.value },
    }).finally(() => {
      loading.value = false;
    });
    const { totalSize, pageSize: size, content, list, ...restData } = data;

    pagination.value = {
      ...rest,
      current: restData.pageNum,
      size,
      total: totalSize,
    };
    dataSource.value = content || list;
  };

  const pageChange = ({ page, limit, total, ...rest }) => {
    pagination.value = {
      ...pagination.value,
      current: page,
      size: limit,
    };
    search();
  };
  const resetPage = () => {
    pagination.value.current = 1;
    pagination.value.size = 10;
  };

  const clearSearch = () => {
    resetPage();
    for (var key in searchData.value) {
      searchData.value[key] = "";
    }
    search();
  };
  const selectionChange = (val) => {
    selectedKeys.value = val;
  };
  onMounted(() => search());
  return {
    selectedKeys,
    dataSource,
    loading,
    pagination,
    searchData,
    search,
    clearSearch,
    resetPage,
    pageChange,
    getDataSource,
    selectionChange,
  };
}
